<%@ page language="java" pageEncoding="UTF-8"%>
<style>
<!--
.contact{border:1px solid #6BB5E8; padding: 20px;margin:10px;}
-->
</style>
<!--top-tours-->	
<div  class="section container" id="section-3">
<div id="portfolio" class="portfolio">
   <div class="top-tours-head text-center">
		  <h3>联系我们</h3>
		  <span></span><img src="ext/index/images/star.png" alt=""><span></span>
		  <div class="container">
				<p>永川区2012年获最具幸福感城市称号，入选国家森林城市；2013年入选智慧型城市；被环球时报评选为2014年经济最具竞争力城市</p>
		  </div>
		  </div>
	      <ul id="filters" class="clearfix wow bounceIn" data-wow-delay="0.4s">
			<li><span class="filter active" data-filter="all">全部</span></li>
			<li><span class="filter" data-filter="scenic">电话</span></li>
			<li><span class="filter" data-filter="colleges">QQ</span></li>
			<li><span class="filter" data-filter="other">邮箱</span></li>
	        </ul>
	     <div id="portfoliolist" style="margin-top: 100px;text-align: center;">
	     			<div class="portfolio all mix_all" style="display: inline-block; opacity: 1;" >
						<div class="portfolio-wrapper wow bounceIn contact" data-wow-delay="0.4s">		
							重庆大学城市科技学院
						</div>
					</div>
					<div class="portfolio scenic mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper wow bounceIn contact" data-wow-delay="0.4s">		
							17608009351
						</div>
					</div>
					<div class="portfolio colleges mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper wow bounceIn contact" data-wow-delay="0.4s">		
							921550445@qq.com
						</div>
					</div>
					<div class="portfolio other mix_all" style="display: inline-block; opacity: 1;">
						<div class="portfolio-wrapper wow bounceIn contact" data-wow-delay="0.4s">		
							cuiyangshou@qq.com
						</div>
					</div>
		   <div class="clearfix"></div>	
	  </div>
</div>
</div>  
<!-- Script for gallery Here-->
<script type="text/javascript" src="ext/index/js/jquery.mixitup.min.js"></script>
<script type="text/javascript">
	$(function () {
		var filterList = {
		init: function () {
// MixItUp plugin
// http://mixitup.io
				$('#portfoliolist').mixitup({
					targetSelector: '.portfolio',
					filterSelector: '.filter',
					effects: ['fade'],
					easing: 'snap',
				// call the hover effect
				onMixEnd: filterList.hoverEffect()
	});				
},
		hoverEffect: function () {
// Simple parallax effect
		$('#portfoliolist .portfolio').hover(
			function () {
			$(this).find('.label').stop().animate({bottom: 0}, 200, 'easeOutQuad');
			$(this).find('img').stop().animate({top: -30}, 500, 'easeOutQuad');				
			},
					function () {
						$(this).find('.label').stop().animate({bottom: -40}, 200, 'easeInQuad');
						$(this).find('img').stop().animate({top: 0}, 300, 'easeOutQuad');								
			}		
		);				
	}
};
// Run the show!
		filterList.init();
	});	
</script>
<!--Gallery Script Ends-->	 
<!--/top-tours-->